// =====================================================
// Header - 顶部导航栏
// =====================================================

import { Layout, Button, Space, Typography } from "antd";
import { ReloadOutlined, BulbOutlined, BulbFilled } from "@ant-design/icons";

const { Header: AntHeader } = Layout;
const { Title } = Typography;

interface HeaderProps {
  darkMode: boolean;
  onToggleDarkMode: () => void;
  onRefresh: () => void;
}

export default function Header({
  darkMode,
  onToggleDarkMode,
  onRefresh,
}: HeaderProps) {
  return (
    <AntHeader
      style={{
        display: "flex",
        alignItems: "center",
        justifyContent: "space-between",
        background: darkMode ? "#001529" : "#fff",
        borderBottom: "1px solid #f0f0f0",
        padding: "0 24px",
      }}
    >
      <Title level={3} style={{ margin: 0, color: darkMode ? "#fff" : "#000" }}>
        📰 RSS AI 阅读器
      </Title>

      <Space>
        <Button icon={<ReloadOutlined />} onClick={onRefresh}>
          刷新所有订阅
        </Button>
        <Button
          icon={darkMode ? <BulbFilled /> : <BulbOutlined />}
          onClick={onToggleDarkMode}
        >
          {darkMode ? "浅色" : "深色"}模式
        </Button>
      </Space>
    </AntHeader>
  );
}
